/**
 * @author CT
 * @email 994599447@qq.com
 * @date 2017.8.21
 */

'use strict';

import React, { Component } from 'react'
import { StyleSheet,Image } from 'react-native'
import {
    Container,
    Button,
    Text,
    Header,
    Left,
    Body,
    Content,
    Right,
    Title,
    Icon,
    View,
    Footer,
} from 'native-base'
import * as I18n from '../config/i18n'
import Ionicons from 'react-native-vector-icons/Ionicons'
import * as Storage from '../common/storage'
import * as config from '../config/appConfig'
import Utils from '../common/utils'
import DeviceInfo from 'react-native-device-info'

/**
 * 设置
 */
export default class AboutPage extends Component {

    constructor(props) {
        super(props);

    }

    //绘制标题栏
    _renderTitleBar = () => {
        return (
            <Header
                androidStatusBarColor="#00797e"
                style={{backgroundColor:'#00adb4'}}>
                <Left>
                    <Button transparent light onPress={()=>{this.props.navigation. goBack()}}>
                        <Icon name='arrow-back' />
                    </Button>
                </Left>
                <Body>
                    <Title>{I18n.t('about.title')}</Title>
                </Body>
                <Right />
            </Header>
        );
    }


    render() {
        return (
            <Container>
                 {this._renderTitleBar()}
                 <Content contentContainerStyle={styles.center}>
                        <Image 
                            style={styles.imgIcon} 
                            source={require('../images/icon.png')} />
                        <Text style={styles.txtVersion}>{I18n.t('app_name')}: v{DeviceInfo.getVersion()}</Text>
                 </Content>
                <Footer style={styles.footer}>
                    <Text style={{fontSize:13}}>{I18n.t('about.description')}</Text>
                    <Text style={{fontSize:13}}>{I18n.t('about.copyright')}</Text>
                </Footer>
            </Container>
        );
    }

}


const styles = StyleSheet.create({
    center:{
        flex: 1,
        alignItems:'center',
        justifyContent: 'center',
      },
    imgIcon:{
        height:80,
        width:80,
    },
    txtVersion:{
        color:'#6C6C6C',
        fontSize:14,
        marginTop:10,
    },
    footer:{
        backgroundColor: 'rgba(0,0,0,0)',
        height: 40,
        flexDirection: 'column',
        alignItems:'center',
        marginBottom:20,
    },
})